<template>
    <div>
        <van-sidebar v-model="activeKey">
            <van-sidebar-item v-for="(item,index) in sidebarList" :key="item.id" :title="item.title" />
        </van-sidebar>
    </div>
</template>

<script>
export default {
    data() {
        return {
            activeKey: 0,
            sidebarList: [
                {id: 1, title: '新品推荐'},
                {id: 2, title: '时令草莓季'},
                {id: 3, title: '芝心薯薯'},
                {id: 4, title: '时令水果茶'},
                {id: 5, title: '超人气奶茶'},
                {id: 6, title: '坦洋工夫茶'},
                {id: 7, title: '冷萃茶'},
                {id: 8, title: '加料'},
                {id: 9, title: '保温袋'},
                {id: 10, title: '限定回顾'}
            ]
        };
    }
}
</script>

<style>
.van-sidebar-item--select::before {
    background-color: #fff;
}
.van-sidebar {
    width: 100px;
}
.van-sidebar-item {
    width: 100px;
    height: 80px;
    display: flex;
    align-items: center;
}
.van-sidebar-item__text {
    color: #666666;
}
</style>